﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../../lib/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
    <link href="../../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
    <script src="../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
    <script src="../../lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>
    <script type="text/javascript">
        var manager = null;
        $(function ()
        {
            manager = $(".l-tree").ligerTree({ checkbox: true, ajaxType: 'get' });

        });
        function reload()
        {
            manager.clear();
            manager.loadData(null, 'tree.json');
        }

        function reload2()
        {
            var node = manager.getSelected();
            if (!node) return;
            manager.reloadNode(node, [
                { "text": "子节点测试1" },
			    { "text": "子节点测试2" }
            ]);
        }

        function reload3()
        {
            var node = manager.getSelected();
            if (!node) return;
            manager.reloadNode(node, 'tree.json');
        }
    </script>
</head>
<body style="padding:10px">
    <input type="text" class="l-text" value="节点名" id="txtNode" style="display:block; float:left; margin-right:10px;" /> 
    
    <a class="l-button" onclick="reload()" style="float:left;margin-right:10px;">重新加载</a>

    <a class="l-button" onclick="reload2()" style="float:left;margin-right:10px;">局部加载</a> 

        <a class="l-button" onclick="reload3()" style="float:left;margin-right:10px;width:100px">局部加载(url)</a> 
    <br />
     <br />
     <!-- 带复选框和图标 -->
    <div style="width:400px; height:400px; border:1px solid #ccc; overflow:auto; clear:both;">
    <ul class="l-tree">
        <li>
            <span>节点1</span>
            <ul>
                <li>
                    <span>节点1.1</span>
                     <ul>
                        <li><span>节点1.1.2</span></li>
                        <li><span>节点1.1.2</span></li>
                     </ul>
                 </li>
                 <li><span>节点1.2</span></li>
            </ul>
        </li> 
        <li><span>节点2</span></li>
        <li isexpand="false">
            <span>节点3</span>
            <ul>
                <li><span>节点3.1</span></li>
                <li><span>节点3.2</span></li>
            </ul>
        </li>
    </ul>
    </div>

        <div style="display:none">
     
    </div>
</body>
</html>
